.modal_container {
  width: 100%;
  margin-bottom: 16px;
  .tips_card {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
    padding: 10px 0;
    width: 100%;
    background-color: rgb(230, 245, 255);
    border: 1px solid rgb(145, 213, 255);
    box-sizing: border-box;
    .icon {
      .icon-jinggao-:before {
        color: rgba(24, 144, 255);
      }
      margin-left: 8px;
    }

    .txt {
      color: #a1a1a1;
    }
  }
}
.drawer_container {
  width: 100%;
  .user_wrap {
    width: 100%;
    .title_wrap {
      display: flex;
      justify-content: space-between;
      align-items: center;
      .type {
        font-weight: normal;
        margin-left: 16px;
        font-size: 12px;
        background-color: #e6f5ff;
        border: 1px solid #91d5ff;
        color: @color-blue-6;
        padding: 2px 4px;
        box-sizing: border-box;
      }
    }

    .info_wrap {
      display: flex;
      column-gap: 10px;
      padding: 0 8px;
      box-sizing: border-box;

      .avatar_wrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        flex: 0 0 0%;
        justify-content: flex-start;
        position: relative;
        &::before {
          content: attr(value);
          color: #ffffff;
          background-color: rgba(255, 255, 255, 0.4);
          font-size: 12px;
          position: absolute;
          top: 0;
          left: 0;
          z-index: 99;
        }
        .tag {
          padding: 0px 4px;
          background-color: #e6f5ff;
          border: 1px solid #91d5ff;
          color: @color-blue-6;
        }

        img {
          width: 102px;
          height: 102px;
          // border-radius: 50%;
        }
        span {
          margin-top: 8px;
        }
      }
      .introduce_wrap {
        width: 100%;
        .row {
          display: flex;
          align-items: center;
          column-gap: 10px;
          margin-bottom: 8px;
          .divider {
            margin: 0;
            border-color: #919191;
          }
          span {
            display: flex;
            align-items: center;
            column-gap: 5px;
            margin-right: 16px;
            &.card {
              i {
                border: 1px solid #a1a1a1;
                background-color: #c1c1c1;
                padding: 0 10px;
                box-sizing: border-box;
                color: #fff;
              }
            }
            .strong {
              font-weight: bold;
              font-size: 18px;
            }
          }
        }
      }
    }
    .detail_wrap {
      width: 100%;
      padding: 0 8px;
      box-sizing: border-box;
      .nav_wrap {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 8px;
        span {
          &.sub_tit {
            font-weight: bold;
          }
          &.tit_icon {
            display: flex;
            align-items: center;
            column-gap: 2px;
            cursor: pointer;
            color: #909090;
            padding: 2px 8px;

            user-select: none;
            .rotate0 {
              transform: rotate(0deg);
            }
            .rotate90 {
              transform: rotate(90deg);
            }
            &:hover {
              background-color: #e1e1e1;
              border-radius: 2px;
            }
          }
        }
      }

      .row {
      }
    }
    .user_detail {
      width: 100%;
      margin: 8px 0 8px 8px;
      .transform_status {
        margin: 8px;
        height: 50px;
        line-height: 50px;
        font-size: 12px;
        background-color: #e6f5ff;
        border: 1px solid #91d5ff;
        color: @color-blue-6;

        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 8px;
        .col {
          color: #a1a1a1;
          &:nth-of-type(2) {
            display: flex;
            align-items: center;
            column-gap: 5px;
            color: #000;
            cursor: pointer;
            user-select: none;
            padding: 0px 8px;

            box-sizing: border-box;
            &:hover {
              height: 60%;
              background-color: #e1e1e1;
              border-radius: 2px;
            }
          }
        }
      }
      .row {
        width: 100%;
        display: flex;
        justify-content: space-between;
        padding: 0 8px;
        box-sizing: border-box;
      }
    }

    .custom_info_wrap {
      width: 100%;

      .row {
        margin: 0px 0 8px 8px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 8px;
        box-sizing: border-box;
        .col {
          flex: 1;
          &.video_wrap {
            display: flex;
            align-items: flex-start;
            justify-content: flex-start;
          }
        }
      }
    }

    .custom_equity_wrap {
      width: 100%;
      .row {
        margin: 0px 0 8px 8px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 8px;
        box-sizing: border-box;
        .col {
          flex: 1;
        }
      }
    }
    .world_wall_wrap {
      width: 100%;
      .world_wall_item {
        padding: 0 8px;
        box-sizing: border-box;
        .auth {
          margin: 0px 0 8px 8px;
        }
        .content_wrap {
          margin-bottom: 8px;
          margin-left: 8px;
          display: flex;
          justify-content: flex-start;
          align-items: flex-start;
          column-gap: 5px;
          .scroll {
            overflow-y: auto;
            min-height: 120px;
            overflow-x: hidden;
            /* 修改滚动条轨道的样式 */
            &::-webkit-scrollbar-track {
              border-radius: 5px;
              background-color: #f1f1f1; /* 设置轨道的背景色 */
            }

            /* 修改滚动条滑块的样式 */
            &::-webkit-scrollbar-thumb {
              background-color: #888; /* 设置滑块的背景色 */
              border-radius: 5px; /* 设置滑块的圆角 */
            }

            /* 修改滚动条滑块在被鼠标悬停时的样式 */
            &::-webkit-scrollbar-thumb:hover {
              background-color: #555; /* 设置悬停时的背景色 */
            }

            /* 修改滚动条的尺寸 */
            &::-webkit-scrollbar {
              width: 10px; /* 设置滚动条的宽度 */
              height: 10px; /* 设置滚动条的高度 */
            }
            .Flex {
              display: flex;
              flex-wrap: wrap;
              column-gap: 5px;
              row-gap: 5px;
              .col {
                padding: 0 !important;
                .img {
                  width: 102px;
                  height: 102px;
                  img {
                    width: 100%;
                    height: 100%;
                  }
                }
              }
            }
          }
        }
        .position {
          margin: 0px 0 8px 8px;
        }
        .time {
          margin: 0px 0 8px 8px;
        }
      }
    }
  }
  .cert_wrap {
    width: 100%;
    .identity_wrap {
      padding: 0 8px;
      .tit_wrap {
        margin-bottom: 8px;
        .sub_tit {
          font-weight: bold;
        }
      }
      .Flex {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-bottom: 8px;
        margin-left: 8px;
        span {
          white-space: nowrap;
          flex: 1;
        }
        .divider {
          margin: 0;
          border-color: #919191;
          margin: 0 5px;
        }
      }

      .tips {
        margin-left: 8px;
        margin-bottom: 8px;
        .row {
          &:first-of-type {
            margin-bottom: 8px;
            display: flex;
            align-items: center;
            column-gap: 5px;
            span {
              &:first-of-type {
                padding: 0px 4px;
                background-color: #e6f5ff;
                border: 1px solid #91d5ff;
                color: @color-blue-6;
              }
              &:nth-of-type(2) {
                color: #a1a1a1;
                font-size: 12px;
              }
            }
          }
          &:nth-of-type(2) {
            display: flex;
            column-gap: 5px;
            .img_item {
              width: 102px;
              height: 102px;
            }
          }
        }
      }

      .video_wrap {
        margin-left: 8px;
        .video {
          width: 102px;
          height: 102px;
        }
      }
    }
  }

  .process_wrap {
    width: 100%;
    .tit_wrap {
      span {
        &.join {
          margin-left: 8px;
          color: #a1a1a1;
          font-weight: normal;
          font-size: 12px;
        }
      }
    }
  }
}

.Flex_cell {
  display: flex;
  flex-direction: nowrap;
  column-gap: 5px;
  justify-content: center;
  align-items: center;
  .photo {
    width: 40px;
    height: 40px;
    cursor: pointer;
  }
  .Dashed {
    border: 1px dashed #c0c0c0;
    padding: 0 4px;
    cursor: default;
    &:nth-of-type(2) {
      padding: 0 10px;
    }
  }
}

.auth_photo {
  margin-bottom: 8px;
  margin-left: 8px;
  .title {
    font-weight: bold;
  }
  .content {
    .tips {
      font-size: 12px;
      color: #c0c0c0;
    }
    margin-bottom: 8px;
    margin-left: 8px;
    .flex {
      display: flex;
      .flex_item {
        flex: 1;
        color: #c0c0c0;
        font-size: 12px;
      }
    }
  }
}
